$(function () {
    // 需求1:用户退出
    let layer = layui.layer;
    $("#logout").on("click", function () {
        // 提示框
        layer.confirm(
            "确认要退出吗?", {
            icon: 3,
            title: "提示",
        },
            function (index) {
                // 跳转页面到登录页,清除token
                location.href = "/login.html";
                localStorage.removeItem("token");
                layer.close(index);
            }
        );
    });

    //   需求2: 渲染用户名和头像
    getUserInfo();
});

// 获取用户信息,渲染用户和头像功能封装
// 封装写到入欧函数外边
// 我要这个函数是全局函数，后边的修改用户信息和头像
function getUserInfo() {
    axios({
        method: "GET",
        url: "/my/userinfo",
        // headers: {
        //     Authorization: localStorage.getItem("token"),
        // },
    }).then((res) => {
        // console.log(res.data);
        //   判断
        if (res.data.status !== 0) {
            return layui.layer.msg(res.data.message);
        }
        // 渲染用户名和头像
        renderUserInfo(res.data.data);
    });
}

function renderUserInfo(user) {
    // 欢迎 名称有要求:优先赋值昵称,不存在才赋值登陆名称
    let name = user.nickname || user.username;
    // console.log(name);
    //   欢迎赋值
    $(".welcome").html("欢迎&nbsp;&nbsp;" + name);
    //   判断有没有图片头像
    if (user.user_pic == null) {
        //   没有图片头像,显示文字头像,隐藏图片头像
        $(".avatar-text").show().html(name[0].toUpperCase());
        $(".avatar-img").hide();
    } else {
        //   有图片头像,隐藏文字头像,显示图片头像
        $(".avatar-text").hide();
        // attr操作自定义属性,prop操作表单属性
        $(".avatar-img").show().attr("src", user.user_pic);
    }
}